window.onload=function(){
var spans=document.getElementsByClassName("round");
var ulArr=product.getElementsByTagName("ul");
for (var i=0;i<spans.length;i++) {
	      spans[i].index = i;
	spans[i].onmouseover=function(){		
		      for(var j=0;j<ulArr.length;j++){
                  ulArr[j].style.display = "none";
                   
                }
		     
		ulArr[this.index].style.display="block";
		
	  }
  }

var previousPage=document.getElementById("previousPage");
var nextPage=document.getElementById("nextPage");
var one=document.getElementById("one");
var two=document.getElementById("two");
   nextPage.onclick=function(){
 	  ulArr[1].style.display="block";
 	   ulArr[0].style.display="none";
 	   two.style.background="#b0743d";
 	   one.style.background="";
  }
 
 previousPage.onclick=function(){
 	  ulArr[1].style.display="none";
 	   ulArr[0].style.display="block";
 	 one.style.background="#b0743d";
 	  two.style.background="";
 }
 


var nav=document.getElementById('nav');
     var navFixed=document.getElementById('navFixed');
     window.onscroll=function(){
         var scrollTop=document.documentElement.scrollTop||document.body.scrollTop;
        if(scrollTop>nav.offsetTop){
             navFixed.style.display='block';    
         }else if(scrollTop<nav.offsetTop){
             navFixed.style.display='none';
         }
     }
     
     
     
       $(document).ready(function(){
				var layer0=$(".layer0");
				var cream=$(".cream");
				cream.mouseover(function(){
					layer0.slideDown();
				})
				layer0.mouseover(function(){
					layer0.show();
				})
				layer0.mouseout(function(){
					layer0.hide();
				})
			})
			$(document).ready(function(){
				var layer1=$(".layer1");
				var cosmetics=$(".cosmetics");
				cosmetics.mouseover(function(){
					layer1.slideDown();
				})
				layer1.mouseover(function(){
					layer1.show();
				})
				layer1.mouseout(function(){
					layer1.hide();
				})
			})
			
			
			$(document).ready(function(){
				var layerfixed0=$(".layerfixed0");
				var creamfixed=$(".creamfixed");
				creamfixed.mouseover(function(){
					layerfixed0.slideDown();
				})
				layerfixed0.mouseover(function(){
					layerfixed0.show();
				})
				layerfixed0.mouseout(function(){
					layerfixed0.hide();
				})
			})
			$(document).ready(function(){
				var layerfixed1=$(".layerfixed1");
				var cosmeticsfixed=$(".cosmeticsfixed");
				cosmeticsfixed.mouseover(function(){
					layerfixed1.slideDown();
				})
				layerfixed1.mouseover(function(){
					layerfixed1.show();
				})
				layerfixed1.mouseout(function(){
					layerfixed1.hide();
				})
			})
}